<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Demo</title>
<style type="text/css">

* {
  margin:0;
  padding:0;
}

body {
  font:normal normal 11px/1.5 Tahoma,Verdana,Arial,Sans-Serif;
  color:black;
  background-color:white;
  padding:50px;
}

h1 {
  font-weight:bold;
  font-size:300%;
  margin:0 0 .5em;
}

</style>
<link rel="stylesheet" type="text/css" href="Demo_files/multi-feed.css">
<style type="text/css">
/* Custom CSS */
.list-entries {
  margin:5px;
  padding:0;
  width:270px;
  float:left;
}
</style>
<script src="Demo_files/JQuery" type="text/javascript"></script><script src="Demo_files/CSS" type="text/javascript"></script><script src="Demo_files/Widget" type="text/javascript"></script></head>
<body>

<h1>Demo for Multi Blogger Feeds Loader</h1>

<div id="feed-list-container"><div class="list-entries"><div class="main-title"><h4>Posting JQuery</h4></div><ul><li><div class="inner" style="height:72px;overflow:hidden;"><span class="fake-img" style="width:72px;height:72px;"></span><div class="title"><a href="http://www.dte.web.id/2013/03/catatan-pembaharuan-jquery.html">Catatan Pembaharuan JQuery</a></div><div class="summary"><span>Baru: Fitur baru ditambahkan ke dalam perpustakaan JQueryDeprecated/Usang: Fitur…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><span class="fake-img" style="width:72px;height:72px;"></span><div class="title"><a href="http://www.dte.web.id/2013/03/get-viewport-width-and-height.html">Mendapatkan Tinggi dan Lebar Layar Monitor</a></div><div class="summary"><span>Versi JQueryvar x = $(window).width(),
    y = $(window).height();

// Tampilkan…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/firefox-scratchpad-execute.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/02/ajax-jquery-memuat-beberapa-bagian.html">AJAX JQuery: Memuat Beberapa Bagian Halaman Sekaligus Dalam Satu Kali Permintaan</a></div><div class="summary"><span>Ini adalah metode dasar yang sering Anda gunakan untuk memuat sebagian halaman k…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/parallax-layout-with-jquery.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/02/building-parallax-layout-with-jquery.html">Membangun Layout Paralaks dengan JQuery</a></div><div class="summary"><span>Membuat layout paralaks, jika Anda masih kesulitan untuk memahami bagaimana cara…</span></div><span style="display:block;clear:both;"></span></div></li></ul><div class="more-link"><a href="http://www.dte.web.id/search/label/JQuery?max-results=20">Selengkapnya</a></div></div><div class="list-entries"><div class="main-title"><h4>Posting CSS</h4></div><ul><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/html-form-elements.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/03/tentang-tooltip-deskripsi-pada-formulir.html">Tentang Tooltip Deskripsi pada Formulir HTML</a></div><div class="summary"><span>Memaksimalkan kerja selektor adjacent sibling sangat bermanfaat untuk menciptaka…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><span class="fake-img" style="width:72px;height:72px;"></span><div class="title"><a href="http://www.dte.web.id/2013/03/css3-facebook-chatbox.html">CSS3 Facebook Chatbox</a></div><div class="summary"><span>HTML.chat-box {
  font:normal normal 11px/1.4 Tahoma,Verdana,Sans-Serif;
  color…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/toggle-side-menu.jpg" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/03/toggle-side-navigation.html">Toggle Side Navigation</a></div><div class="summary"><span>HTML

    
        ≡
        
            
                Home
          …</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/px-and-em-unit-in-web-design.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/03/satuan-px-em-dan-pada-font.html">Kapan Harus Menggunakan px, % dan em?</a></div><div class="summary"><span>Meskipun, kebanyakan dari kita masih bertahan dengan satuan piksel saat menentuk…</span></div><span style="display:block;clear:both;"></span></div></li></ul><div class="more-link"><a href="http://www.dte.web.id/search/label/CSS?max-results=20">Selengkapnya</a></div></div><div class="list-entries"><div class="main-title"><h4>Widget-Widget Blogger</h4></div><ul><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/multi-feed-loader-blogger-widget.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/04/widget-blogger-untuk-menampilkan-daftar.html">Widget Blogger untuk Menampilkan Daftar Posting Terbaru dalam Label-Label yang Spesifik</a></div><div class="summary"><span>Judulnya sangat panjang karena Saya sendiri tidak tahu harus memberi nama apa ke…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/blogger-json-feed-rotator-plugin.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/03/blogger-feed-rotator-plugin.html">Plugin Feed Rotator untuk Blogger</a></div><div class="summary"><span>Plugin ini pada dasarnya merupakan perpaduan antara Basic JQuery Image Rotator d…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/colorful-popular-posts-widget.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2013/02/colorful-popular-post-widget.html">Modifikasi Widget Posting Populer Menjadi Berwarna-Warni</a></div><div class="summary"><span>Pada konfigurasi widget Posting Populer, pastikan bahwa Anda memilih model widge…</span></div><span style="display:block;clear:both;"></span></div></li><li><div class="inner" style="height:72px;overflow:hidden;"><img src="Demo_files/jquery-ajax-search.png" style="width:72px;height:72px;"><div class="title"><a href="http://www.dte.web.id/2012/11/kotak-penelusuran-blogger-dengan-ajax.html">Kotak Penelusuran Blogger dengan Ajax JQuery</a></div><div class="summary"><span>Kotak Penelusuran Blogger dengan Ajax JQueryBeberapa waktu yang lalu Saya pernah…</span></div><span style="display:block;clear:both;"></span></div></li></ul><div class="more-link"><a href="http://www.dte.web.id/search/label/Widget?max-results=20">Selengkapnya</a></div></div></div>
<div style="clear:both;"></div>


<script type="text/javascript">

var multiFeed = {
	feedsUri: [
		{
			name: "Posting JQuery",
			url: "http://www.dte.web.id",
			tag: "JQuery"
		},
		{
			name: "Posting CSS",
			url: "http://www.dte.web.id",
			tag: "CSS"
		},
		{
			name: "Widget-Widget Blogger",
			url: "http://www.dte.web.id",
			tag: "Widget"
		}
	],
	numPost: 4,
	showThumbnail: true,
	showSummary: true,
	summaryLength: 80,
	titleLength: "auto",
	thumbSize: 72,
	containerId: "feed-list-container",
	readMore: {
		text: "Selengkapnya",
		endParam: "?max-results=20"
	}
};

</script>
<script type="text/javascript" src="Demo_files/multi-feed.js"></script>

<div style="margin-top:1em;text-align:right;"><a href="http://www.dte.web.id/">DTE :]</a></div>


</body></html>